<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" style="overflow:hidden;">
<head>
    <meta charset="UTF-8">
    <link th:href="@{favicon.ico}" rel="shortcut icon"/>
    <link rel="stylesheet" th:href="@{layui/css/layui.css}"/>
    <link rel="stylesheet" th:href="@{css/index.css}"/>
    <link rel="stylesheet" th:href="@{css/main.css}"/>
    <link rel="stylesheet" th:href="@{/css/plugins/font-awesome-4.7.0/css/font-awesome.min.css}"  media="all">
    <title>cms-开源社区管理</title>
    <style>
        i{
            margin-right: 15px;
        }
    </style>
</head>
<body>
<div class="layui-layout layui-layout-admin">
    <div class="layui-header">
        <div class="layui-logo layui-hide-xs layui-bg-black">用户名:<span th:text="${username}"/></div>
        <a class="side-toggle layui-layout-left" href="#">
            <i class="layui-icon layui-icon-shrink-right"></i>
            <i class="layui-icon layui-icon-spread-left"></i>
        </a>
        <!-- 头部区域（可配合layui 已有的水平导航） -->
        <ul class="layui-nav layui-layout-left">
            <!-- 移动端显示 -->
            <li class="layui-nav-item layui-show-xs-inline-block layui-hide-sm" lay-header-event="menuLeft">
                <i class="layui-icon layui-icon-spread-left"></i>
            </li>
        </ul>
        <ul class="layui-nav layui-layout-right">
            <li class="layui-nav-item layui-hide layui-show-md-inline-block">
                <a href="javascript:;">
                    <img src="img/tx.jpg" class="layui-nav-img">
                    <span th:text="${username}" style="margin-right: 20px"/>
                    <div class="layui-nav-child">
                        <div class="timo-nav-child-box">
                            <div>
                                <a class="open-popup" data-title="个人信息" th:attr="data-url=@{'/userInfo?username='+${username}}" data-size="680,464">
                                    <i class="fa fa-user-o"></i>
                                    个人信息
                                </a>
                            </div>
                            <div>
                                <a class="open-popup" data-title="修改密码" th:attr="data-url=@{'/editPwd?username='+${username}}" data-size="456,296">
                                    <i class="fa fa-lock" style="font-size:17px;width:12px;"></i>
                                    修改密码
                                </a>
                            </div>
                            <div>
                                <a th:href="@{/logout}">
                                    <i class="fa fa-power-off"></i>
                                    退出登录
                                </a>
                            </div>
                        </div>
                    </div>
                </a>
<!--                <dl class="layui-nav-child">-->
<!--                    <dd><a href="javascript:;"><i class="layui-icon layui-icon-user"></i>个人中心</a></dd>-->
<!--                    <dd><a href="javascript:;"><i class="layui-icon layui-icon-set"></i>设  置</a></dd>-->
<!--                    <dd><a href="/"><i class="layui-icon layui-icon-close"></i>退出登录</a></dd>-->
<!--                </dl>-->
            <li class="layui-nav-item timo-nav-user">
<!--                <a class="timo-header-nickname" th:text="${username}">TIMO</a>-->
<!--                <div class="layui-nav-child">-->
<!--                    <div class="timo-nav-child-box">-->
<!--                        <div>-->
<!--                            <a class="open-popup" data-title="个人信息" th:attr="data-url=@{/userInfo}" data-size="680,464">-->
<!--                              <i class="fa fa-user-o"></i>-->
<!--                                个人信息-->
<!--                            </a>-->
<!--                        </div>-->
<!--                        <div>-->
<!--                            <a class="open-popup" data-title="修改密码" th:attr="data-url=@{/editPwd}" data-size="456,296">-->
<!--                              <i class="fa fa-lock" style="font-size:17px;width:12px;"></i>-->
<!--                                修改密码-->
<!--                            </a>-->
<!--                        </div>-->
<!--                        <div>-->
<!--                            <a th:href="@{/logout}">-->
<!--                                <i class="fa fa-power-off"></i>-->
<!--                                退出登录-->
<!--                            </a>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                </div>-->
            </li>
            </li>
<!--            <li class="layui-nav-item" lay-header-event="menuRight" lay-unselect>-->
<!--                <a href="javascript:;">-->
<!--                    <i class="layui-icon layui-icon-more-vertical"></i>-->
<!--                </a>-->
<!--            </li>-->
        </ul>
    </div>
    <div class="layui-side layui-bg-black">
        <div class="layui-side-scroll">
            <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
            <ul class="layui-nav layui-nav-tree" lay-filter="layui-nav-side">
                <li class="layui-nav-item">
                <!--页面加载指向当前-->
                    <a href="javascript:;" th:attr="lay-url='/sys/about'"><i class="layui-icon layui-icon-home"></i>主页</a>
                </li>
                <li class="layui-nav-item layui-nav-itemed">
                    <a class="" href="javascript:;"><i class="layui-icon layui-icon-group"></i>信息管理</a>
                    <dl class="layui-nav-child">
                        <dd><a href="javascript:;" th:attr="lay-url='/queryInfo/residentInfo'">住户基本信息</a>
                        <dd><a href="javascript:;" th:attr="lay-url='/queryInfo/residentPayInfo'">住户缴费信息</a></dd>
                        <dd><a href="javascript:;" th:attr="lay-url='/queryInfo/parkingSpaceInfo'">停车位基本信息</a></dd>
                        <dd><a href="javascript:;" th:attr="lay-url='/queryInfo/parkingPayInfo'">停车费缴纳信息</a></dd>
                        <dd><a href="javascript:;" th:attr="lay-url='/queryInfo/repair'">维修信息</a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item"><a href="javascript:;"><i class="layui-icon layui-icon-delete"></i>信息删除</a></li>
                <li class="layui-nav-item"><a href="javascript:;"><i class="layui-icon layui-icon-edit"></i>信息修改</a></li>
                <li class="layui-nav-item layui-nav-itemed">
                    <a class="" href="javascript:;"><i class="layui-icon layui-icon-release"></i>信息添加</a>
                    <dl class="layui-nav-child">
                        <dd><a href="javascript:;">代缴停车费</a></dd>
                        <dd><a href="javascript:;">添加维修记录</a>
                        <dd><a href="javascript:;">新增住户信息</a></dd>
                        <dd><a href="javascript:;">新增停车位信息</a></dd>
                        <dd><a href="javascript:;">代缴物业费</a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;"><i class="layui-icon layui-icon-log"></i>数据统计</a>
                </li>
            </ul>
        </div>
    </div>
    <div class="layui-body layui-tab layui-tab-brief" lay-allowclose="true" lay-filter="iframe-tabs">
        <!-- 标签栏 -->
        <ul class="layui-tab-title">
<!--            <li class="layui-this" lay-id="home"><i class="layui-icon layui-icon-home"></i>首页</li>-->
        </ul>
        <!-- 内容区域 -->
        <div class="layui-tab-content">
<!--            <div class="layui-tab-item layui-show" lay-allowClose="false">-->
<!--                <iframe src="/sys/about" frameborder="0" class="layui-layout-iframe"></iframe>-->
<!--            </div>-->
        </div>
    </div>
<!--    <div class="layui-footer" style="background-color: #DDEAFF;color: black;width: content-box">-->
<!--        &lt;!&ndash; 底部固定区域 &ndash;&gt;-->
<!--        <h6 align="center">Copyright © 2021 long.com MIT Licensed</h6>-->
<!--    </div>-->
</div>
<!--全局js-->
<script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/layui/layui.js}"></script>
<script th:src="@{/js/main.js}"></script>
<script>
    layui.use('layer', function () {
        var layer = layui.layer;//加载layer模块
        function timeout(msgs) {
            layer.alert(msgs, {
                icon: 5,
                title: '系统提示',
                skin: 'layui-layer-molv',
                closeBtn: 0
            }, function (index) {
                location.href = "${pageContext.request.contextPath}/";
            });
        }
    var socket;
    if(typeof(WebSocket) == "undefined") {
        console.log("浏览器不支持WebSocket");
    }else{
        console.log("浏览器支持WebSocket");
        //实现化WebSocket对象，指定要连接的服务器地址与端口  建立连接
        //ws://localhost:8082/imserver/888
        var socketUrl="http://"+$("#ippath").val()+"/websocketserver/"+$("#id").val();
        socketUrl=socketUrl.replace("https","ws").replace("http","ws");
        if(socket!=null){
            socket.close();
            socket=null;
        }
        socket = new WebSocket(socketUrl);
        //打开事件
        socket.onopen = function() {
            console.log("websocket已打开");
        };
        //获得消息事件
        socket.onmessage = function(msg) {
            console.log(msg.data);
            //发现消息进入    开始处理前端触发逻辑
            timeout(msg.data);
        };
        //关闭事件
        socket.onclose = function() {
            console.log("websocket已关闭");
        };
        //发生了错误事件
        socket.onerror = function() {
            console.log("websocket发生了错误");
        }
    }
    })
</script>
</body>
</html>